<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt"%> 
<%
	String path = request.getContextPath();
	String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%>
<!DOCTYPE html>
<html lang="en">
	<head>
		<base href="<%=basePath%>">
		<meta charset="utf-8" />
		<title></title>
		<meta name="description" content="overview & stats" />
		<meta name="viewport" content="width=device-width, initial-scale=1.0" />
		<link href="static/css/bootstrap.min.css" rel="stylesheet" />
		<link href="static/css/bootstrap-responsive.min.css" rel="stylesheet" />
		<link rel="stylesheet" href="static/css/font-awesome.min.css" />
		<!-- 下拉框 -->
		<link rel="stylesheet" href="static/css/chosen.css" />
		
		<link type="text/css" rel="stylesheet" href="plugins/zTree/2.6/zTreeStyle.css"/>
		<link rel="stylesheet" href="static/css/ace.min.css" />
		<link rel="stylesheet" href="static/css/ace-responsive.min.css" />
		<link rel="stylesheet" href="static/css/ace-skins.min.css" />
		
		<style type="text/css">
			.scrollbar::-webkit-scrollbar{
			    width: 10px;
			    height: 16px;
			    background-color: #f5f5f5;
			}
			/*定义滚动条的轨道，内阴影及圆角*/
			.scrollbar::-webkit-scrollbar-track{
			    -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,.3);
			    border-radius: 10px;
			    background-color: #f5f5f5;
			}
			/*定义滑块，内阴影及圆角*/
			.scrollbar::-webkit-scrollbar-thumb{
			    /*width: 10px;*/
			    height: 20px;
			    border-radius: 10px;
			    -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,.3);
			    background-color: #555;
			}
		</style>
		
		<link rel="stylesheet" href="static/css/datepicker.css" /><!-- 日期框 -->
		<script type="text/javascript" src="static/js/jquery-1.7.2.js"></script>
		<script type="text/javascript" src="static/js/jquery.tips.js"></script>
		
<script type="text/javascript">
	
	
	//保存
	function save(){
		if(($("#OFFICE_ID").val()==$("#PARENT_ID").val())&&($("#PARENT_ID").val()!="")){
			$("#PARENTNAME").tips({
				side:3,
	            msg:'不能以自己为上级单位',
	            bg:'#AE81FF',
	            time:2
	        });
			$("#PARENTNAME").focus();
			return false;
		}
		if($("#NAME").val()==""){
			$("#NAME").tips({
				side:3,
	            msg:'请输入机构名称',
	            bg:'#AE81FF',
	            time:2
	        });
			$("#NAME").focus();
			return false;
		}
		if($("#CODE").val()==""){
			$("#CODE").tips({
				side:3,
	            msg:'请输入机构编码',
	            bg:'#AE81FF',
	            time:2
	        });
			$("#CODE").focus();
			return false;
		}
		if($("#area.id").val()==""){
			$("#area.id").tips({
				side:3,
	            msg:'请选择地区',
	            bg:'#AE81FF',
	            time:2
	        });
			$("#area.id").focus();
			return false;
		}
		if($("#TYPE").val()==""){
			$("#TYPE").tips({
				side:3,
	            msg:'请输入机构类型',
	            bg:'#AE81FF',
	            time:2
	        });
			$("#TYPE").focus();
			return false;
		}
		if($("#GRADE").val()==""){
			$("#GRADE").tips({
				side:3,
	            msg:'请输入机构等级',
	            bg:'#AE81FF',
	            time:2
	        });
			$("#GRADE").focus();
			return false;
		}
		if($("#ADDRESS").val()==""){
			$("#ADDRESS").tips({
				side:3,
	            msg:'请输入联系地址',
	            bg:'#AE81FF',
	            time:2
	        });
			$("#ADDRESS").focus();
			return false;
		}
		if($("#ZIPCODE").val()==""){
			$("#ZIPCODE").tips({
				side:3,
	            msg:'请输入邮政编码',
	            bg:'#AE81FF',
	            time:2
	        });
			$("#ZIPCODE").focus();
			return false;
		}
		if($("#MASTER").val()==""){
			$("#MASTER").tips({
				side:3,
	            msg:'请输入负责人',
	            bg:'#AE81FF',
	            time:2
	        });
			$("#MASTER").focus();
			return false;
		}
		
		var myreg = /^(((13[0-9]{1})|159)+\d{8})$/
		if($("#PHONE").val()==""){
			$("#PHONE").tips({
				side:3,
	            msg:'请输入电话号码',
	            bg:'#AE81FF',
	            time:2
	        });
			$("#PHONE").focus();
			return false;
		}else if($("#PHONE").val().length != 11 && !myreg.test($("#PHONE").val())){
			$("#PHONE").tips({
				side:3,
	            msg:'电话号码式不正确',
	            bg:'#AE81FF',
	            time:3
	        });
			$("#PHONE").focus();
			return false;
		}
		
		
		if($("#FAX").val()==""){
			$("#FAX").tips({
				side:3,
	            msg:'请输入传真',
	            bg:'#AE81FF',
	            time:2
	        });
			$("#FAX").focus();
			return false;
		}
		
		if($("#EMAIL").val()==""){
			$("#EMAIL").tips({
				side:3,
	            msg:'请输入电子邮箱',
	            bg:'#AE81FF',
	            time:2
	        });
			$("#EMAIL").focus();
			return false;
		}else if(!ismail($("#EMAIL").val())){
			$("#EMAIL").tips({
				side:3,
	            msg:'邮箱格式不正确',
	            bg:'#AE81FF',
	            time:3
	        });
			$("#EMAIL").focus();
			return false;
		}
		
		if($("#USEABLE").val()==""){
			$("#USEABLE").tips({
				side:3,
	            msg:'请输入是否可用',
	            bg:'#AE81FF',
	            time:2
	        });
			$("#USEABLE").focus();
			return false;
		}
		if($("#PRIMARYPERSON").val()==""){
			$("#PRIMARYPERSON").tips({
				side:3,
	            msg:'请输入主负责人',
	            bg:'#AE81FF',
	            time:2
	        });
			$("#PRIMARYPERSON").focus();
			return false;
		}
		if($("#DEPUTYPERSON").val()==""){
			$("#DEPUTYPERSON").tips({
				side:3,
	            msg:'请输入副负责人',
	            bg:'#AE81FF',
	            time:2
	        });
			$("#DEPUTYPERSON").focus();
			return false;
		}
		$("#Form").submit();
		$("#zhongxin").hide();
		$("#zhongxin2").show();
	}
	function ismail(mail){
		return(new RegExp(/^(?:[a-zA-Z0-9]+[_\-\+\.]?)*[a-zA-Z0-9]+@(?:([a-zA-Z0-9]+[_\-]?)*[a-zA-Z0-9]+\.)+([a-zA-Z]{2,})+$/).test(mail));
	}
</script>
	</head>
<body>
	<div id="officeTree" style="width: 228px;height: 300px;z-index: 10;position: absolute;left:95px;top:40px;border-radius: 5px; border:2px solid #438EB9;display: none;">
		<div style="width:100%; height:30px; background:#438EB9;">
        	<span style="font-size:15px; font-family:'微软雅黑'; color:#fff; float:left; margin-left:10px; margin-top:3px;">请选择上级机构</span>
            <img src="static/img/office/exit.png"  style="float:right; margin-right:10px; margin-top:7px;cursor:pointer;" onclick="treeEdit()"/>
        </div>
        <div class="scrollbar" style="width: 100%;height: 268px; background-color:#fff;overflow-y:scroll;">
        	<ul id="tree" class="tree" style="overflow:auto;"></ul>
        </div>
	</div>
	<div style="z-index:1;">
		<form action="office/${msg }.do" name="Form" id="Form" method="post">
			<input type="hidden" name="OFFICE_ID" id="OFFICE_ID" value="${pd.OFFICE_ID}"/>
			<div id="zhongxin">
			<table id="table_report" class="table table-striped table-bordered table-hover">
				<tr>
					<td style="width:70px;text-align: right;padding-top: 13px;">上级机构:</td>
					<td><input type="text" name="PARENTNAME" id="PARENTNAME" maxlength="32" placeholder="请选择上级机构"  title="上级机构" readonly="value" value="${pd.PARENTNAME}" />
						<c:choose>
							<c:when test="${pd.PARENT_ID==null}">
								<input type="hidden" id="PARENT_ID" name="PARENT_ID"  value="0">
							</c:when>
							<c:otherwise>
								<input type="hidden" id="PARENT_ID" name="PARENT_ID"  value="${pd.PARENT_ID}">
							</c:otherwise>
						</c:choose>
						
					
					</td>
				</tr>
				<tr>
					<td style="width:70px;text-align: right;padding-top: 13px;">机构名称:</td>
					<td><input type="text" name="NAME" id="NAME" value="${pd.NAME}" maxlength="32" placeholder="这里输入机构名称" title="机构名称"/></td>
				</tr>
				<tr class="info">
					<td style="width:70px;text-align: right;padding-top: 13px;">地区名称:</td>
					<td>
					<select class="chzn-select" name="area.id" id="area.id" data-placeholder="请选择地区" style="vertical-align:top;">
						<option value=""  ></option>
						<c:forEach items="${areaList}" var="area">
							<option value="${area.id}" <c:if test="${pd.AREA_ID == area.id}">selected</c:if> >${area.name}</option>
						</c:forEach>
					</select>
					</td>
				</tr>
				<tr>
					<td style="width:70px;text-align: right;padding-top: 13px;">机构编码:</td>
					<td><input type="text" name="CODE" id="CODE" value="${pd.CODE}" maxlength="32" placeholder="这里输入机构编码" title="机构编码"/></td>
				</tr>
				<tr>
					<td style="width:70px;text-align: right;padding-top: 13px;">机构类型:</td>
					
					<td>
						<select name="TYPE" id="TYPE" id="TYPE" >
							<c:choose>
								<c:when test="${pd.TYPE == null}">
									<option value="">请选择部门</option>
									<option value="1">公司</option>
									<option value="2">部门</option>
									<option value="3">小组</option>
								</c:when>
								<c:when test="${pd.TYPE == '1'}">
									<option value="1">公司</option>
									<option value="2">部门</option>
									<option value="3">小组</option>
								</c:when>
								<c:when test="${pd.TYPE == '2'}">
									<option value="2">部门</option>
									<option value="1">公司</option>
									<option value="3">小组</option>
								</c:when>
								<c:when test="${pd.TYPE == '3'}">
									<option value="3">小组</option>
									<option value="1">公司</option>
									<option value="2">部门</option>	
								</c:when>
							</c:choose>
							
						</select><%-- <input type="text" name="TYPE" id="TYPE" value="${pd.TYPE}" maxlength="32" placeholder="这里输入机构类型" title="机构类型"/> --%>
					</td>
				</tr>
				<tr>
					<td style="width:70px;text-align: right;padding-top: 13px;">机构等级:</td>
					<td><input type="text" name="GRADE" id="GRADE" value="${pd.GRADE}" maxlength="32" placeholder="这里输入机构等级" title="机构等级"/></td>
				</tr>
				<tr>
					<td style="width:70px;text-align: right;padding-top: 13px;">联系地址:</td>
					<td><input type="text" name="ADDRESS" id="ADDRESS" value="${pd.ADDRESS}" maxlength="32" placeholder="这里输入联系地址" title="联系地址"/></td>
				</tr>
				<tr>
					<td style="width:70px;text-align: right;padding-top: 13px;">邮政编码:</td>
					<td><input type="text" name="ZIPCODE" id="ZIPCODE" value="${pd.ZIPCODE}" maxlength="32" placeholder="这里输入邮政编码" title="邮政编码"/></td>
				</tr>
				<tr>
					<td style="width:70px;text-align: right;padding-top: 13px;">负责人:</td>
					<td><input type="text" name="MASTER" id="MASTER" value="${pd.MASTER}" maxlength="32" placeholder="这里输入负责人" title="负责人"/></td>
				</tr>
				<tr>
					<td style="width:70px;text-align: right;padding-top: 13px;">电话号码:</td>
					<td><input type="text" name="PHONE" id="PHONE" value="${pd.PHONE}" maxlength="32" placeholder="这里输入电话号码" title="电话号码"/></td>
				</tr>
				<tr>
					<td style="width:70px;text-align: right;padding-top: 13px;">传真:</td>
					<td><input type="text" name="FAX" id="FAX" value="${pd.FAX}" maxlength="32" placeholder="这里输入传真" title="传真"/></td>
				</tr>
				<tr>
					<td style="width:70px;text-align: right;padding-top: 13px;">电子邮箱:</td>
					<td><input type="text" name="EMAIL" id="EMAIL" value="${pd.EMAIL}" maxlength="32" placeholder="这里输入电子邮箱" title="电子邮箱"/></td>
				</tr>
				<tr>
					<td style="width:70px;text-align: right;padding-top: 13px;">是否可用:</td>
					<td><input type="text" name="USEABLE" id="USEABLE" value="${pd.USEABLE}" maxlength="32" placeholder="这里输入是否可用" title="是否可用"/></td>
				</tr>
				<tr>
					<td style="width:70px;text-align: right;padding-top: 13px;">主负责人:</td>
					<td><input type="text" name="PRIMARYPERSON" id="PRIMARYPERSON" value="${pd.PRIMARYPERSON}" maxlength="32" placeholder="这里输入主负责人" title="主负责人"/></td>
				</tr>
				<tr>
					<td style="width:70px;text-align: right;padding-top: 13px;">副负责人:</td>
					<td><input type="text" name="DEPUTYPERSON" id="DEPUTYPERSON" value="${pd.DEPUTYPERSON}" maxlength="32" placeholder="这里输入副负责人" title="副负责人"/></td>
				</tr>
				<tr>
					<td style="text-align: center;" colspan="10">
						<a class="btn btn-mini btn-primary" onclick="save();">保存</a>
						<a class="btn btn-mini btn-danger" onclick="top.Dialog.close();">取消</a>
					</td>
				</tr>
			</table>
			</div>
			
			<div id="zhongxin2" class="center" style="display:none"><br/><br/><br/><br/><br/><img src="static/images/jiazai.gif" /><br/><h4 class="lighter block green">提交中...</h4></div>
			
		</form>
	</div>
	
		<!-- 引入 -->
		<script type="text/javascript">window.jQuery || document.write("<script src='static/js/jquery-1.9.1.min.js'>\x3C/script>");</script>
		<script src="static/js/bootstrap.min.js"></script>
		<script type="text/javascript" src="static/js/chosen.jquery.min.js"></script><!-- 下拉框 -->
		<script type="text/javascript" src="static/js/bootstrap-datepicker.min.js"></script><!-- 日期框 -->
		
		<!-- ace scripts -->
		<script src="static/js/ace-elements.min.js"></script>
		<script src="static/js/ace.min.js"></script>
		<script type="text/javascript" src="plugins/zTree/2.6/jquery.ztree-2.6.min.js"></script>
		<script type="text/javascript">
		$(top.hangge());
		$(function() {
			
			//单选框
			$(".chzn-select").chosen(); 
			$(".chzn-select-deselect").chosen({allow_single_deselect:true}); 
			
			//日期框
			$('.date-picker').datepicker();
			
			$("#PARENTNAME").click(function(){
				if($("#officeTree").css("display")=="none"){
					$("#officeTree").show();
				}else{
					$("#officeTree").hide();
				}
			});
			
			 $.ajax({
				url : "<%=basePath%>office/treeData.do",
				type : "post",
				async: false,
				 /* data : {
					'platformId' : stationId
				}, */ 
				dataType: 'json', 
			    success:function(data){
			    	var zTreeNodes=eval(data.zTreeNodes);
			    	var setting = {
			    		 callback: {
							click: zTreeOnClick
						},
					    showLine: true    
					};
					zTree = $("#tree").zTree(setting, zTreeNodes);
			    }
			 }); 
			
		});
		
		</script>
		<script type="text/javascript">
			function zTreeOnClick(event, treeId, treeNode) {
    			//alert(treeNode.tId + ", " + treeNode.name+ ", " +treeId);
    			var json=zTree.getNodeByTId(treeNode.tId);
    			$("#PARENTNAME").val(treeNode.name);
    			
    			$("#PARENT_ID").val(json.office_id);
    			
    			$("#officeTree").hide();
    		}
		
			function treeEdit(){
				$("#officeTree").hide();
			}
		</script>
</body>
</html>